<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
    <!--form 代表整个表单，action表示收集好数据后提交的地址，#占位符表示提交到当前页-->
    <form action="#">
    <!--  表单里可以写各种表单控件，如输入框、单选多选等
            input的type的值：
            text        普通文本输入框
            password    密码输入框
            radio       单选
            checkbox    多选
            submit      提交按钮
            reset       重置按钮
            button      普通按钮
            date        日期
            color       颜色



            password    密码输入框


            -->
<!--        placeholder 占位符-->
        姓名:<input type="text" name="uname" placeholder="请输入姓名"> <br>
<!--        value value属性本来就存在，用来保存控件的值，也可以通过value属性设置输入框的默认值-->
        昵称:<input type="text" name="nickname" value="rose"><br>
<!--        readonly 只读 只能看不能输入，可以提交苏剧-->
        昵称:<input type="text" name="nickname" value="rose" readonly><br>
<!--        disabled 禁用。可以看到值 但做不了任何操作 数据也无法提交-->
        昵称:<input type="text" name="nickname" value="rose" disabled><br>
<!--        maxlength 设置输入框的最大长度-->
        密码:<input type="password"maxlength="6" name="pwd" value="123456"><br>
<!--        单选/多选必须设置相同的name分到同一组！且需要给每一个选项设置value值，否则提交的是on
            checked 默认选上-->
        性别：
            <input type="radio" name="gender" value="1">男
            <input type="radio" name="gender" value="0">女
            <br>
<!--多选-->
        爱好：
        <input type="checkbox" name="like" value="cy">抽烟
        <input type="checkbox" name="like" value="dk">喝酒
        <input type="checkbox" name="like" value="tt" checked>烫头
        <input type="checkbox" name="like" value="java" checked>学Java
        <br>
        <hr>
        生日:<input type="date" name="birthday"> <br>
        幸运色:<input type="color" name="lColor"> <br>
        缩放:<input type="range" name="scale"> <br>
        文件:<input type="file" name="file"><br>
        <hr>
        <hr>
        <select name="city">
            <option value="bj">北京</option>
            <option value="sh" selected>上海</option>
            <option value="wh">武汉</option>
            <option value="cc">长春</option>

        </select>
        <br>
        <input type="checkbox" id="ok">
        <label for="ok">我同意以上协议</label>
        <br>
        <label for="uu">关联文字</label>
        <input type="text" id="uu">


        <hr>
        <input type="submit" value="点我提交">
        <input type="reset" value="点我重置">
        <input type="button" value="普通按钮">
        <button>普通按钮</button>

    </form>
</body>
</html>